<template>
  <div class="app-container">
    <div class="filter-container" style="display: flex;
    flex-direction: row-reverse;">
      <div class="lineBox">
        <el-form :inline="true" :model="listQuery" class="demo-form-inline">
          <el-form-item>
            <el-button size="mini" type="primary" @click="add">
              添加
            </el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>

    <div class="myTable" style="min-height: 600px;">
      <el-table :key="tableKey" :data="list" fit size="mini" highlight-current-row style="width: 100%;">
        <el-table-column label="ID" prop="id" align="center" min-width="50" />
        <el-table-column label="标引方式" prop="template_name" align="center" min-width="200">
          <template slot-scope="{row,$index}">
            <span v-if="row.index_type== '1'">正则</span>
            <span v-if="row.index_type== '2'">字典</span>
            <span v-if="row.index_type== '3'">正则加字典</span>
            <span v-if="row.index_type== '4'">定位</span>
          </template>
        </el-table-column>
        <el-table-column label="标引对象" prop="update_time" align="center" min-width="100">
          <template slot-scope="{row,$index}">
            <span v-if="row.index_object== 'zrz'">责任者</span>
            <span v-if="row.index_object== 'jh'">件号</span>
            <span v-if="row.index_object== 'ztc'">主题词</span>
            <span v-if="row.index_object== 'wz'">类型</span>
            <span v-if="row.index_object== 'tm'">标题</span>
            <span v-if="row.index_object== 'sj'">时间</span>
            <span v-if="row.index_object== 'dh'">档号</span>
            <span v-if="row.index_object== 'mj'">密级</span>
            <span v-if="row.index_object== 'bgqx'">保管期限</span>
            <span v-if="row.index_object== 'qzh'">全宗号</span>
            <span v-if="row.index_object== 'flh'">分类号</span>
            <span v-if="row.index_object== 'qwbs'">全文标识</span>
            <span v-if="row.index_object== 'lbh'">类别号</span>
            <span v-if="row.index_object== 'wz'">文种</span>
            <span v-if="row.index_object== 'tm'">题名</span>
            <span v-if="row.index_object== 'wjbh'">文件编号</span>
            <span v-if="row.index_object== 'ztls'">载体类型</span>
            <span v-if="row.index_object== 'ztsl'">载体数量</span>
            <span v-if="row.index_object== 'ztdw'">载体单位</span>
            <span v-if="row.index_object== 'ztgg'">载体规格</span>
            <span v-if="row.index_object== 'swh'">缩微号</span>
            <span v-if="row.index_object== 'dagdh'">档案馆号</span>
            <span v-if="row.index_object== 'sjlx'">数据类型</span>
            <span v-if="row.index_object== 'fz'">附注</span>
          </template>
        </el-table-column>

        <el-table-column label="审核采纳次数" prop="hits" align="center" min-width="200">
          <template slot-scope="{row,$index}">
            {{ row.hits }}
          </template>
        </el-table-column>

        <el-table-column label="启用状态" prop="status" align="center" min-width="100">
          <template slot-scope="{row,$index}">
            <div v-if="row.status== '1'">
              <span class="statusPie success" />
              <span class="text">是</span>
            </div>
            <div v-else>
              <span class="statusPie danger" />
              <span class="text">否</span>
            </div>
          </template>
        </el-table-column>

        <el-table-column label="操作" align="center" min-width="160" class-name="small-padding fixed-width">
          <template slot-scope="{row,$index}">
            <el-button type="primary" size="mini" @click="skip(row,$index,0)">
              编辑
            </el-button>

            <el-button type="info" size="mini" @click="skip(row,$index,1)">
              复制
            </el-button>

            <el-button size="mini" type="danger" @click="handleDelete(row,$index)">
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination size="mini" :page-sizes="[10]" :total="total" :page.sync="listQuery.page"
        :limit.sync="listQuery.limit" layout="total, sizes, prev, pager, next, jumper" @pagination="dataList" />
    </div>
  </div>
</template>

<script>
import { indexSysApi } from '@/api/indexSys'
import { api } from '@/api/template'
import Pagination from '@/components/Pagination' // secondary package based on el-pagination
export default {

  components: { Pagination },

  data() {
    return {

      formInline: {
        user: "",
        region: ""
      },
      value: '',

      tableKey: 0,
      list: [],
      total: 0,
      listLoading: false,
      listQuery: {
        pageNumber: 1,
        page: 1,
        limit: 10,

      },


    }
  },



  created() {

    this.dataList()
  },
  methods: {

    // 数据列表
    async dataList() {
      this.listLoading = true
      const response = await indexSysApi("getIndexSys", this.listQuery)
      if (response.code == 200) {
        this.list = response.data.resultList
        this.total = response.totalCount
        // this.type = response.type
        //   // Just to simulate the time of the request
        setTimeout(() => {
          this.listLoading = false
        }, 1.5 * 1000)
      }
    },

    // 删除指标
    async handleDelete(row, index) {
      this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const data = { 'id': row.id }

        const response = await indexSysApi("delIndexSysById", data)
        if (response.code == 200) {
          this.$notify({
            title: '成功',
            message: response.message,
            type: 'success',
            duration: 2000
          })
          this.list.splice(index, 1)
        } else {
          this.$notify({
            title: '失败',
            message: response.message,
            type: 'error',
            duration: 2000
          })
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },

    // 修改跳转
    skip(row, index, cp) {

      this.$router.push('/indexingSystem/save?id=' + row.id + '&cp=' + cp)

    },
    add() {
      this.$router.push('/indexingSystem/save')
    }

  }
}
</script>

<style lang="scss" scoped>
.demo-image__preview {
  float: left;
  margin-left: 5px;
}
.demonstration {
  font-size: 12px;
  color: #333;
  font-weight: normal;
}
</style>
